<template>
	<view>
		<n-com-select v-model="selectArea" :dictList="areas" memo="请选择地址"></n-com-select>
	</view>
</template>

<script>
	import ToolVuex from "@/tool/vuex/ToolVuex.js";

	export default {
		props: {
			modelValue: {
				type: [Array, String],
				default: ""
			}
		},
		data() {
			return {
				areas: [],
				selectArea: []
			}
		},
		mounted() {
			this.selectArea = this.modelValue;
			ToolVuex.dispatch("area/listArea").then(res => {
				this.areas = transformTree(res[0].child);
			})
		},
		watch: {
			selectArea(val) {
				this.$emit("update:modelValue", val);
			}
		}
	}

	function transformTree(areas) {
		if (!areas) {
			return [];
		}
		return areas.map(item => ({
			name: item.name,
			val: item.cityCode.substr(-6),
			children: transformTree(item.child)
		}));
	}
</script>

<style>
</style>
